<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:replace="_header_include::frag(~{::title},~{},~{})">
    <title>后台管理系统</title>
    <style>
    </style>
</head>
<body>
<div id="maindiv" class="maindiv mainPadding" style="display: none;">
    <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
        <el-breadcrumb-item>Home</el-breadcrumb-item>
        <el-breadcrumb-item>数据报表</el-breadcrumb-item>
        <el-breadcrumb-item>首次资源分配表</el-breadcrumb-item>
    </el-breadcrumb>
    <el-row class="marginB20">
        <el-button type="primary" :disabled="btnDisabled" @click="searchYesterday">昨天</el-button>
        <el-button type="success" :disabled="btnDisabled" @click="searchWeek">近七天</el-button>
        <el-button type="warning" :disabled="btnDisabled" @click="searchMonth">本月</el-button>
        <shiro:hasPermission name="statistics:firstResourceAllocation:export">
            <el-button type="danger"  @click="exportRs">导出Excel报表</el-button>
        </shiro:hasPermission>
    </el-row>
    <div class="mainSearchBg">
        <div class="mainSearchFormBox">
            <el-form :inline="true" :model="form" class="demo-form-inline mainSearchForm" ref="form">
                <el-form-item label="起止时间:">
                    <el-date-picker format="yyyy-MM-dd HH:mm" v-model="form.startTime" type="datetime" value-format="yyyy-MM-dd HH:mm" placeholder="选择日期"></el-date-picker>
                </el-form-item>
                <el-form-item label="—" class="widthauto">
                    <el-date-picker format="yyyy-MM-dd HH:mm" v-model="form.endTime" type="datetime" value-format="yyyy-MM-dd HH:mm" placeholder="选择日期"></el-date-picker>
                </el-form-item>
                <el-form-item label="事业部:">
                    <el-select v-model="form.deptId" placeholder="事业部" @change="curTelGroupSale" style="width: 100%;" clearable filterable :disabled="isDeptDisabled">
                        <el-option
                                v-for="item in deptList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="电销组:">
                    <el-select v-model="form.orgId" placeholder="电销组" style="width: 100%;" clearable filterable :disabled="isDisabled">
                        <el-option
                                v-for="item in orgTeleArr"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="话务转入:">
                    <el-select v-model="form.isTransfer" placeholder="话务转入" style="width: 100%;" clearable filterable>
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <div class="mainSearchBtnBox">
                    <el-button icon="el-icon-search" type="primary" @click="searchTable(1)" :disabled="btnDisabled" class="searchBtn">搜索</el-button>
                </div>
            </el-form>
        </div>
        <el-row>
            <el-table
                    ref="tableData"
                    tooltip-effect="dark"
                    style="width: 100%"
                    border
                    :data="tableData"
                    v-loading="loading"
                    :span-method="arraySpanMethod"
            >
                <el-table-column align="center" type="index" label="序号"  width="55" :index="indexFun"></el-table-column>
                <!-- 组列 -->
                <el-table-column align="center" :key="index" :prop="item.fieldCode" :label="item.displayName" v-for="(item,key,index) in tableColums" v-if="item.fieldCode == 'orgName'" :width="item.width">
                    <template slot-scope="scope">
                        <el-button @click="gotoTeam(scope.row)" type="text" size="small">{{scope.row.orgName}}</el-button>
                    </template>
                </el-table-column>
                <!-- 其他列 -->
                <el-table-column align="center" :key="index" :prop="item.fieldCode" :label="item.displayName" :width="item.width" v-else>
                </el-table-column>
            </el-table>
            <table-pagination :pager="pager" @change="searchTable()"></table-pagination>
        </el-row>
    </div>
</div>
<!-- import common js-->
<div th:include="_footer_include :: #jsLib"></div>
</body>
<script th:inline="javascript">
    var deptList=[[${deptList}]];
    var queryOrg=[[${saleGroupList}]];//电销组
    var fieldList=[[${fieldList}]];//表头list
    var curOrgId = [[${curOrgId}]];
    var curDeptId=[[${deptId}]];
    var mainDivVM = new Vue({
        el: '#maindiv',
        data: function() {
            return {
                loading: false,
                isDisabled: false,
                isDeptDisabled: false,
                btnDisabled: false,
                pager:{
                    total: 0,
                    currentPage: 1,
                    pageSize: 20
                },
                form: {
                    startTime: '',
                    endTime: '',
                    deptId:curDeptId,
                    orgId: curOrgId,
                    isTransfer: ''
                },
                export: {
                    startTime:'',
                    endTime:'',
                    deptId:curDeptId,
                    orgId: curOrgId,
                    isTransfer: ''
                },
                tableData: [],//表格数据
                tableColums: fieldList,//表头list
                orgTeleArr: "",//电销组
                deptList: deptList,//电销组
            }
        },
        methods: {
            searchTable(firstPage) {
                // this.tableColums= fieldList;
                var startTime = this.form.startTime;
                var endTime = this.form.endTime;
                if(endTime && startTime){
                    startTime = new Date(this.form.startTime);
                    endTime = new Date(this.form.endTime);
                    if(startTime>endTime){
                        this.$message({
                            message: '开始时间不能大于结束时间',
                            type: 'warning'
                        });
                        return;
                    }
                    var date = new Date();
                    var currentDate = moment(date).format("YYYY-MM-DD 23:59");
                    date.setMonth(date.getMonth()-6);
                    var beforeSixMonth = moment(date).format("YYYY-MM-DD 00:00");
                    var currentDateRes = new Date(currentDate);
                    var beforeSixMonthRes = new Date(beforeSixMonth);
                    if(startTime < beforeSixMonthRes || endTime > currentDateRes){
                        this.$message({
                            message: '请选择近6个月内的时间',
                            type: 'warning'
                        });
                        mainDivVM.btnDisabled=false;
                        return;
                    }
                    startTime = this.limitTime(startTime, null);
                    endTime = this.limitTime(null, endTime);
                }else{
                    this.$message({
                        message: '请选择起止时间',
                        type: 'warning'
                    });
                    return;
                }

                var param = {};
                param.startTime = this.minuteFormat(startTime);
                param.endTime = this.minuteFormat(endTime);
                param.pageSize = this.pager.pageSize;
                if(firstPage){
                    param.pageNum = firstPage;
                }else{
                    param.pageNum = this.pager.currentPage;
                }
                param.orgId =  this.form.orgId; // 电销组
                param.deptId=this.form.deptId;
                param.isTransfer = this.form.isTransfer;
                this.loading = true;
                this.btnDisabled = true;
                axios.post('/statistics/firstResourceAllocation/getFirstResourceAllocationPage',param).then(function (response) {
                    if(!response){
                        mainDivVM.$message({
                            message: "接口调用失败",
                            type: 'error'
                        });
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        return ;
                    }
                    var resobj= response.data;
                    if(!resobj){
                        mainDivVM.$message({
                            message: "接口调用失败",
                            type: 'error'
                        });
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        return ;
                    }
                    if(resobj.code!='0'){
                        mainDivVM.$message({
                            message: resobj.msg,
                            type: 'error'
                        });
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        return ;
                    }
                    var resobjData=resobj.data.data;
                    // 表格数据渲染
                    mainDivVM.tableData=resobjData;
                    // 分页
                    mainDivVM.pager.currentPage= resobj.data.currentPage;
                    mainDivVM.pager.total= resobj.data.total;
                    // 插入合计一行
                    if(resobjData.length>0){
                        mainDivVM.summaryFun(param);
                    }else{
                        mainDivVM.loading=false;
                    }
                    mainDivVM.btnDisabled=false; //按钮可点
                    // 给导出参数赋值
                    mainDivVM.export.startTime = mainDivVM.minuteFormat(startTime);
                    mainDivVM.export.endTime = mainDivVM.minuteFormat(endTime);
                    mainDivVM.export.orgId = mainDivVM.form.orgId;
                    mainDivVM.export.isTransfer = mainDivVM.form.isTransfer;
                }).catch(function (error) {
                    console.log(error);
                    mainDivVM.loading = false;
                    mainDivVM.btnDisabled = false;//按钮可点
                    mainDivVM.$message({
                        message: "请求失败，请稍后重试",
                        type: "error"
                    });
                });
            },
            summaryFun (param) {
                mainDivVM.loading=true;
                axios.post('/statistics/firstResourceAllocation/getFirstResourceAllocationCount',param).then(function (response) {
                    if(!response){
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        mainDivVM.$message({
                            message: "接口调用失败",
                            type: 'error'
                        });
                        return ;
                    }
                    var resobj= response.data;
                    if(!resobj){
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        mainDivVM.$message({
                            message: "合计接口调用失败",
                            type: 'error'
                        });
                        return ;
                    }
                    if(resobj.code!='0'){
                        mainDivVM.loading=false;
                        mainDivVM.btnDisabled=false;
                        mainDivVM.$message({
                            message: "合计接口调用失败",
                            type: 'error'
                        });
                        return ;
                    }
                    var resobjData=resobj.data;
                    // 插入合计一行
                    mainDivVM.tableData.unshift(resobjData[0]);
                    // loading
                    mainDivVM.loading=false;
                });
            },
            limitTime (start, end) {
                var startTime = this.minuteFormat (start);
                var endTime = this.minuteFormat (end);
                var date = new Date();
                data = this.minuteFormat (date);// 现在的时间
                data = data.slice(0,8);
                if(startTime){
                    var s = startTime.slice(0,8);
                    if(s < data){
                        this.form.startTime = moment(start).format("YYYY-MM-DD 00:00");
                        return this.form.startTime;
                    }
                    return start;
                }
                if(endTime){
                    var e = endTime.slice(0,8);
                    if(e < data){
                        this.form.endTime = moment(end).format("YYYY-MM-DD 23:59");
                        return this.form.endTime;
                    }
                    return end;
                }
            },
            arraySpanMethod({ row, column, rowIndex, columnIndex }) { // 合并第一行
                if (rowIndex === 0) {
                    if (columnIndex === 0) {
                        return [0, 0];
                    } else if (columnIndex === 1) {
                        return [1, 2];
                    }
                }
            },
            indexFun (index) { // 表格序号
                return index;
            },
            gotoTeam (row) { // 页面跳转
                var orgId = row.orgId; // 电销组id
                var orgName = row.orgName; // 电销组name
                var startTime = this.export.startTime;
                var endTime = this.export.endTime;
                var isTransfer = this.export.isTransfer;
                if(orgId === "0" && orgName === "合计"){
                    window.location.href=" /statistics/firstResourceAllocation/firstRATableSum?orgId=" + this.export.orgId + "&startTime=" + startTime + "&endTime=" + endTime + "&isTransfer=" + isTransfer;
                }else if(orgId){
                    window.location.href=" /statistics/firstResourceAllocation/firstRATableTeam?orgId=" + orgId + "&startTime=" + startTime + "&endTime=" + endTime+ "&isTransfer=" + isTransfer;
                }
            },
            minuteFormat (m) {
                if (!m) {return "";}
                var timeStr = new Date(m);
                var yearRes = timeStr.getFullYear();
                var monthRea = timeStr.getMonth()+1;
                monthRea = monthRea < 10 ?  "0" + monthRea : monthRea;
                var dateRes = timeStr.getDate();
                dateRes = dateRes < 10 ?  "0" + dateRes : dateRes;
                var hoursRes = timeStr.getHours();
                hoursRes = hoursRes < 10 ?  "0" + hoursRes : hoursRes;
                var minRes = timeStr.getMinutes();
                minRes = minRes < 10 ?  "0" + minRes : minRes;
                var timeRes = "" + yearRes + monthRea + dateRes + hoursRes + minRes;
                return timeRes;
            },
            searchYesterday(){ // 昨天
                var today = new Date();
                today.setTime(today.getTime()-24*60*60*1000);
                var startTime = today.getFullYear()+"-" + (today.getMonth()+1) + "-" + today.getDate()+" 00:00";
                var endTime =today.getFullYear()+"-" + (today.getMonth()+1) + "-" + today.getDate()+" 23:59";
                this.form.startTime=startTime;
                this.form.endTime=endTime;
                this.searchTable(1);
            },
            searchWeek(){ // 近七天
                var a = new Date();
                var year = a.getFullYear();
                var month = a.getMonth();
                var date = a.getDate();
                var b = new Date(year,month,date);
                var c = b.valueOf()-6*24*60*60*1000;
                var d = b.valueOf();
                var startTime= new Date(c);
                var endTime = new Date(d);
                this.form.startTime=startTime.getFullYear()+"-" + (startTime.getMonth()+1) + "-" + startTime.getDate()+" 00:00";
                this.form.endTime=endTime.getFullYear()+"-" + (endTime.getMonth()+1) + "-" + endTime.getDate()+" 23:59";
                this.searchTable(1);
            },
            searchMonth(){ // 本月
                var a = new Date();
                var year = a.getFullYear();
                var month = a.getMonth();
                var date = a.getDate();
                var b = new Date(year,month,date);
                var f= new Date(year,month,01);
                var c = f.valueOf();
                var startTime= new Date(c);
                this.form.startTime=startTime.getFullYear()+"-" + (startTime.getMonth()+1) + "-" + startTime.getDate()+" 00:00";
                this.form.endTime=year+"-"+(month+1)+"-"+date+" 23:59";
                this.searchTable(1);
            },
            curTelGroupSale(seleVal){
                if(seleVal==null||seleVal==""){
                    return ;
                }
                this.form.orgId = '';
                this.getTelGroupSale(seleVal);
            },
            getTelGroupSale(seleVal){
                if(!seleVal){return;}
                param={};
                param.parentId=seleVal;
                param.orgType=1;
                axios.post('/base/getGroupList',param).then(function (response) {
                    mainDivVM.orgTeleArr=response.data.data;
                }).catch(function (error) {
                    mainDivVM.$message({
                        message: "电销组请求失败，请稍后重试",
                        type: "error"
                    });
                });
            },
            firstCurTelGroupSale(seleVal){
                if(seleVal==null||seleVal==""){
                    return ;
                }
                this.getTelGroupSale(seleVal);
            },
            exportRs(){
                var param = {};
                param.startTime = this.export.startTime;
                param.endTime =  this.export.endTime;
                param.orgId =  this.export.orgId;
                param.deptId=this.export.deptId;
                param.isTransfer = this.export.isTransfer;
                axios.post('/statistics/firstResourceAllocation/exportFirstResourceAllocationPage',param,{responseType:'blob'})
                    .then(function (response) {
                        var data =  response.data;
                        var fileName = response.headers.filename;
                        saveAs(data,decodeURI(fileName));
                    })
                    .catch(function (error) {
                        console.log(error);
                        mainDivVM.$message({
                            message: "导出失败，请稍后重试",
                            type: "error"
                        });
                    });
            }
        },
        created(){
            // 默认进入显示当天时间
            var today = new Date();
            var startTime = moment(today).format("YYYY-MM-DD 00:00");
            var endTime = moment(today).format("YYYY-MM-DD 23:59");
            this.form.startTime=startTime;
            this.form.endTime=endTime;

            if(curDeptId){
                this.isDeptDisabled = true;
                this.form.deptId = curDeptId;
                this.export.deptId = this.form.deptId;
                this.firstCurTelGroupSale(curDeptId);
                if(curOrgId){
                    this.isDisabled = true;
                    this.form.orgId = curOrgId;
                    this.export.orgId = this.form.orgId;
                }
            }

            // if(curOrgId){this.isDisabled= true;}
            this.export.startTime = this.minuteFormat(this.form.startTime);
            this.export.endTime = this.minuteFormat(this.form.endTime);
            var localVal=localStorage.getItem('allChangePageSize')?parseInt(localStorage.getItem('allChangePageSize')):'';
            if(localVal){this.pager.pageSize = localVal;}
            this.searchTable();
        },
        mounted(){
            document.getElementById('maindiv').style.display = 'block';
        }
    })

</script>
</html>